import React from 'react';
import { Text, View, StyleSheet } from 'react-native';
import PropTypes from 'prop-types';
import { px2dp } from 'bee/utils/px2dp';
import { sizes, colors } from 'bee/themes';

const DetailInfoItem = ({ title, content }) => (
  <View style={styles.box}>
    <Text style={styles.title}>{title}</Text>
    <Text style={styles.title}>{content}</Text>
  </View>
);

DetailInfoItem.propTypes = {
  title: PropTypes.string.isRequired,
  content: PropTypes.string.isRequired,
};
const styles = StyleSheet.create({
  box: {
    height: px2dp(77),
    flexDirection: 'row',
    paddingHorizontal: px2dp(55),
    justifyContent: 'space-between',
    alignItems: 'center',
  },
  title: {
    fontSize: sizes.f2,
    color: colors['1101'],
  },
});

export default DetailInfoItem;
